﻿<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8" />
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="format-detection" content="email=no" />
    <title>课程展示-某某舞蹈培训</title>
    <th:block th:include="include :: front-common-css-js" />   
    <style>

        .course { }
        .course .title { font-size: 24px; color: #333; text-align: center; padding-top: 60px; }
        .course .con { padding-top: 50px; }
        .course .con .h1 { color: #333; font-weight: bold; }
        .course .con .p1 { color: #666; padding: 14px 0 40px 0; }
        .course .list > li { padding-top: 50px; }
        .course .list > li .box { overflow: hidden; }
        .course .list > li .box .age { color: #ec8718; font-weight: bold; background: #f1f1f1; padding: 15px 0 15px 20px; }
        .course .list > li .box .pic { padding-top: 50px; }
        .course .list > li .box .left { float: left; padding-right: 95px; }
        .course .list > li .box .right { float: right; padding-left: 95px; }
        .course .list > li .box .p1 { padding-top: 90px; line-height: 30px; }

        @media (max-width: 1024px) {
            .course .list > li .box .pic { text-align: center; }
            .course .list > li .box .left { float: none; padding-right: 0; }
            .course .list > li .box .right { float: none; padding-left: 0; }
            .course .list > li .box .p1 { padding-top: 30px; }
        }
    </style>
    <script>
		$(function () {
		});
    </script>
</head>
<body>
    <!--主体内容 end-->
    <th:block th:include="include :: front-header" />  
    
   <!-- 
     <div class="child_banner"><img src="img/child_banner2.jpg" class="g_imgf" /></div>
     <div class="s_child_banner"><img src="img/child_banner2_m.jpg" class="g_imgf" /></div> 
    -->
    <!--主体内容-->
    <div class="course">
        <div class="g_cw">
            <p class="title" th:text="${course.name}">课程展示</p>
            <div class="con">
                <div class="g_content" th:text="${course.introduce}"><p>课程简介xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p></div>
                <div style="margin-bottom: 50px;"><img th:src="${course.picture}"   src="/front/img/15d54ef78cf9a016.jpg"/></div>
                <div style="float: left;">
                <!-- @{/xxx(k1=v1,k2=v2)} 对应url结构：xxx?k1=v1&k2=v2 -->
                <a th:href="@{/front/self/apply(courseId=${course.id},type=2)}">
                      <p class="btn" ><span class="more">报名</span></p></a></div>
                      <div style="float: left;margin-left: 30px;">
                <a th:href="@{/front/self/appointment(courseId=${course.id},type=2)}"><p class="btn" ><span class="more">预约</span></p></a>
                </div>
            </div>
        </div>
    </div>
    
    <!--主体内容 end-->
    <th:block th:include="include:: front-footer" /> 
      
</body>
</html>

